<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/template/bibliotecaTemplate.xhtml">
	<ui:define name="titulo">
		<h:outputLabel value="Music Bay.com - #{msg.biblioteca}" />
	</ui:define>

	<f:metadata>
		<f:viewParam name="genero" value="#{generoManagedBean.genero}" converter="generoConversor" />
	</f:metadata>

	<ui:define name="cont">
		<div id="artistaPainel">
			<p:panel styleClass="painelArtista" header="#{generoManagedBean.genero.genero}">
				<h:form id="artistasForm">
					<ui:repeat var="artista" value="#{generoManagedBean.genero.artistas}">
						<div id="artistacontext">
							<h:outputLabel value="#{artista.nome}" styleClass="subtitle" />
							<h:link outcome="artistaPage" id="artistaPage">
								<p:graphicImage url="/faces/image?id=#{artista.idArtista}&amp;tipo=a" width="150"
									height="150" styleClass="imgEdit" title="#{artista.nome}" />
								<f:param name="artista" value="#{artista.idArtista}" />
							</h:link>
						</div>
					</ui:repeat>
				</h:form>
			</p:panel>
		</div>
	</ui:define>

	<ui:define name="sobre">
		<div id="generosListadiv">
			<h:form>
				<p:panel header="#{msg.generos}">
					<p:button value="#{msg.todosArtistas}" styleClass="generosLista" outcome="all" />
					<ui:repeat var="gen" value="#{generoManagedBean.generos}">
						<p:button value="#{gen.genero}" styleClass="generosLista" outcome="update">
							<f:param name="genero" value="#{gen.idgenero}" />
						</p:button>
					</ui:repeat>
				</p:panel>
			</h:form>
		</div>
	</ui:define>

</ui:composition>
</html>